{:W('Cate/header')}
{:W('Cate/left')}

<!--内容部分-->
<div class="content">
    <div class="title">
        <p>服务管理</p>
        <i class="icon-angle-right"></i>
        <p><a href="#" onClick="javascript :history.go(-1);" style="color:#515974">开通服务</a></p>
        <i class="icon-angle-right"></i>
        <p class="active">创建订单</p>
    </div>
    <div class="admin_list clearfix">
        <div class="create_order clearfix">
            <dl class="clearfix">
                <dt>通道</dt>
                <dd>
                    {$resname}
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>计费方式</dt>
                <dd>
                    <span data-id="servicetype" data-servicetype="1" class="active">通道授权</span>
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>服务时间</dt>
                <dd>
                    <volist name="renew" id="re" key="k">
                    <span data-id="renew" data-json='{$re|json_encode}' <if condition="$k eq 1"> class="active" </if> >{$re.renew_text}</span>
                    </volist>
                    <em id="rEndtime">服务到期时间：{$renew[0]['endtime']}</em>
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>并发量</dt>
                <dd>
                    <volist name="count" id="co" key="k">
                        <span data-id="count" data-count="{$co}" <if condition="$k eq 1"> class="active" </if> >{$co}</span>
                    </volist>
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>支付方式</dt>
                <dd>
                    <span data-id="paytype" data-paytype="0" class="active">线下支付</span>
                    <!--<label>
                        <i></i>
                        <input type="radio" name="zf">
                        <img src="__PUBLIC__/images/wx.jpg">
                    </label>
                    <label>
                        <i></i>
                        <input type="radio" name="zf">
                        <img src="__PUBLIC__/images/zfb.jpg">
                    </label>-->
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>应付金额</dt>
                <dd>
                    <h3 id="open_price">￥340.00</h3>
                </dd>
            </dl>
            <dl class="clearfix">
                <dt style="display: block">&emsp;</dt>
                <dd>
                    <button type="button" value="确认支付">确认支付</button>
                </dd>
            </dl>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        var create_order = $('.create_order');
        var create_orderDd = $('.create_order > dl > dd');
        create_orderDd.width(create_order.width() - 100);

        //单选
        create_order.find('input').click(function () {
            create_order.find('i').css('background','url(\'../Public/images/xuanze-1.png\') no-repeat');
            var _this = $(this);
            if(_this.is(':checked')){
                _this.prev().css('background','url(\'../Public/images/xuanze-2.png\') no-repeat')
            }else{
                _this.prev().css('background','url(\'../Public/images/xuanze-1.png\') no-repeat')
            }
        });
        var resnum = "<?php echo $resnum; ?>";  // 资源数量
        var renew = 1;  // 服务时长
        var count = 20;  // 资源数量
        // 初始化金额
        var money = resnum*(renew/12)*(count/20)*350;
        var open_price = $('#open_price');
        open_price.text('￥'+money.toFixed(2));
        $('.create_order > dl > dd > span').each(function () {
            var _this = $(this);
            _this.click(function () {
                _this.addClass('active').siblings().removeClass('active');
                // 获取服务时长数据
                var tRenew = $('span[data-id="renew"].active').data('json');
                var dId = _this.data('id');
                if(dId == 'renew'){   // 选择服务时间
                    $('#rEndtime').text('服务到期时间：'+tRenew['endtime']);
                    renew = tRenew['renew'];
                }
                // 获取并发量选中的数据
                count = $('span[data-id="count"].active').data('count');
                // 计算费用
                money = resnum*(tRenew['renew']/12)*(count/20)*350;
                open_price.text('￥'+money.toFixed(2));
            })
        })

        // 提交
        $('button[type="button"]').on('click',function(){
            var conf = {
                'resids':"<?php echo $resid; ?>",
                'companyid':"<?php echo $companyid; ?>",
                'servicetype':$('span[data-id="servicetype"].active').data('servicetype'),
                'duration':renew,
                'count':count,
                'paymentmethod':$('span[data-id="paytype"].active').data('paytype'),
            };
            $.post("{:U('/open_record/create_order_post')}",conf,function(data){
                if(data.result == '0'){
                    layer.msg(data.msg,{icon:1,time:2000},function(){
                        self.location = document.referrer;   // 返回上一页并刷新
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })

    })
</script>
</body>
</html>